<template>
  <router-view></router-view>
</template>

<script setup lang="ts">
// 自定义loading， message， messagebox
import { ElMessage, ElMessageBox, ElLoading } from "element-plus";
import type { Action } from "element-plus";

const Mloading = function (message: string = "Loading") {
  return ElLoading.service({
    lock: true,
    text: message,
    background: "rgba(0, 0, 0, 0.7)",
  });
};

const MsgBox = function (message: string, Callback?: any) {
  return ElMessageBox.alert(message, "提示", {
    confirmButtonText: "OK",
    callback: (action: Action) => {
      console.log(action);
      Callback(action);
    },
  });
};


declare type MessageType = '' | 'success' | 'warning' | 'info' | 'error';
const MsgBoxConfirm = function (message: any, messageType: MessageType, CallbackSuccess?: any, CallbackFailed?: any) {
  return ElMessageBox.confirm(message, {
    title:"提示",
    confirmButtonText: "确认",
    cancelButtonText: "取消",
    type: messageType,
  })
    .then(() => {
      if (CallbackSuccess !== undefined){
        CallbackSuccess()
      }

    })
    .catch(() => {
      if (CallbackSuccess !== undefined){
        CallbackFailed()
      }
    });
};

provide("$message", ElMessage);
provide("$msgbox", MsgBox);
provide("$msgboxConfirm", MsgBoxConfirm);
provide("$loading", Mloading);

</script>

